<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>惊喜</title>
</head>

<body>
    <!DOCTYPE html>
    <html lang="en">

    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta http-equiv="X-UA-Compatible" content="ie=edge">
        <title></title>
        <link rel="stylesheet" href="../../static/assets/swiper/swiper-3.4.2.min.css">
        <link rel="stylesheet" href="../../static/css/common/adaptor.css">
        <link rel="stylesheet" href="../../static/css/common/common.css">
        <link rel="stylesheet" href="../../static/css/classify/product.css">
    </head>

    <body>
        <div class="layout">
            <!--轮播图-->
            <div class="productImg">
                <div class="swiper-container">
                    <!--动态渲染-->
                </div>
            </div>
            <!--商品名称和价格-->
            <div class="product_Name">
                <!--动态渲染-->
            </div>
            <!--商品喜欢人数-->
            <div class="like">
                <!--动态渲染-->
            </div>
            <!--商品信息和评论-->
            <div class="msgAndcomments">
                <div class="btn">
                    <!--动态渲染-->
                </div>
                <!--商品详情-->
                <div class="hideMsgOrComments productMsg productMsgOrComments">
                    <!--动态渲染-->
                </div>
                <!--商品评价-->
                <div class="hideMsgOrComments commentsContainer productMsgOrComments">
                    <div class="commentClassify">
                        <!--动态渲染评论分类按钮-->
                    </div>
                    <!--所有评论-->
                    <div class="hidecommentList allCommentList commentList">
                        <!--动态渲染所以评论-->
                    </div>
                    <!--好评-->
                    <div class="hidecommentList goodCommentList commentList">
                        <!--动态渲染好评-->
                    </div>
                    <!--中评-->
                    <div class="hidecommentList neutralCommentList commentList">
                        <!--动态渲染中评-->
                    </div>
                    <!--差评-->
                    <div class="hidecommentList badCommentList commentList">
                        <!--动态渲染差评-->
                    </div>
                </div>
                <!--商品详情页底部-->
                <div class="footer clearfix">
                    <div class="kefu">客服</div>
                    <div class="shoppingCar">购物车</div>
                    <div class="addCar">加入购物车 </div>
                    <div class="buy">立即购买</div>
                </div>
                <div class="kefuMarsk">
                    <div class="kefuMsg">
                        <div class="icon"></div>
                        <div class="textMsg">
                            <div class="text">微信客服</div>
                            <div class="addKefu">请添加添潮上次的客服微信：</div>
                            <div class="kefuNum">客服1：<span class="kefuOne">shangchengkefu001</span>，<span class="copyBtn copyBtnOne" data-clipboard-text="shangchengkefu001">点击复制</span></div>
                            <div class="kefuNum">客服2：<span class="kefuTow">shangchengkefu002</span>，<span class="copyBtn copyBtnTwo" data-clipboard-text="shangchengkefu002">点击复制</span></div>
                        </div>
                        <div class="cancle">取消</div>
                    </div>
                </div>
                <div class="carAndBuyMarsk">
                    <!-- 动态渲染 -->
                </div>
            </div>
            <div class="tips"></div>
        </div>
        <!-- 商品sku -->
        <script type="text/template" id="carAndBuyMarsk">
            <div class="cbmBox">
                <div class="picAndPrice">
                    <div class="pic" data-skuId=""><img src="" alt=""></div>
                    <div class="price">￥ <span class="skuPrice" data-diamond="" data-cash=""></span></div>
                    <div class="count"><span class="showSku"></span>库存(<span class="inventory"></span>)</div>
                    <div class="closeBtn"></div>
                </div>
                <div class="scrollBox">
                    {{each skuDetail.skus as item index}}
                    <div class="skuItem">
                        <div class="skuName">{{item.name}}</div>
                        <div class="skuList clearfix">
                            {{each item.values as inItem index}}
                            <div class="listItem" data-index="{{index}}" data-checkStatus=0 data-code="{{inItem.code}}">{{inItem.name}}</div>
                            {{/each}}
                        </div>
                    </div>
                    {{/each}}
                </div>
                <div class="pNum">
                    <div class="text">数量</div>
                    <div class="addOrCut clearfix">
                        <div class="cut"></div>
                        <div class="num">1</div>
                        <div class="add"></div>
                    </div>
                </div>
                {{if skuDetail.pSkuArray[0].inventory>0}}
                <div class="footerBtn" canDo=1></div>
                {{/if}} {{if skuDetail.pSkuArray[0].inventory===0}}
                <div class="footerBtn greyFooterBtn" canDo=0></div>
                {{/if}}
            </div>
        </script>
        <!--商品图片录播图-->
        <script type="text/template" id="productAutoImg">
            <div class="swiper-wrapper">
                {{each pics as item index}}
                <div class="swiper-slide"><img src="{{item}}"></div>
                {{/each}}
            </div>
            {{if pics.length > 1}}
            <div class="swiper-pagination"></div>
            {{/if}}
        </script>
        <!--商品名称及价格-->
        <script type="text/template" id="productMsgAndPrice">
            <div class="name">{{msg.productName}}</div>
            <div class="product_price">¥&nbsp;{{msg.price}}</div>
            <div class="diamondAndCash">钻石 :&nbsp;{{msg.diamond}}&nbsp;&nbsp;&nbsp;&nbsp;现金 :&nbsp;{{msg.diamondPrice}}</div>
            <div class="salesCount">已售<span>{{msg.salesCount}}</span>件</div>
        </script>
        <!--商品喜欢人数-->
        <script type="text/template" id="peopleLikeProduct">
            <div class="likeCout"><span>{{love.loveCount}}</span>人喜欢</div>
            <div class="userImg">
                <ul>
                    {{each love.loveList as item index}}
                    <li class="user"><img src="{{item}}" alt=""></li>
                    {{/each}}
                </ul>
            </div>
            {{if !love.loving}}
            <div class="thanks">如果你也喜欢</div>
            <div class="addClic">
                <div class="heart"><img src="../../static/img/like_U@3x.png" alt=""></div>
            </div>
            {{/if}} {{if love.loving}}
            <div class="thanks">谢谢你的喜欢</div>
            <div class="addClic">
                <div class="heart"><img src="../../static/img/like_S@3x.png" alt=""></div>
            </div>
            {{/if}}
        </script>
        <!--商品详细信息-->
        <script type="text/template" id="msgContent">
            {{each details as item index}}
            <img class="lazy" data-original="{{item}}" width="100%" alt=""> {{/each}}
        </script>
        <!--商品详情和评价按钮-->
        <script type="text/template" id="btns">
            <span class="msgAndcommentsBtn msg msgBtn" index=1>商品详情</span>
            <span class="msgAndcommentsBtn comments commentsBtn" index=2>累计评价({{commentsNum}})</span>
        </script>
        <!--商品评论分类按钮-->
        <script type="text/template" id="commentClassifyBtn">
            <ul>
                <li><span href="javascript:void(0);" class="commentItem" index=1>全部</span></li>
                <li><span href="javascript:void(0);" class="commentItem" index=2>好评({{allCommentNum.hao}})</span></li>
                <li><span href="javascript:void(0);" class="commentItem" index=3>中评({{allCommentNum.zhong}})</span></li>
                <li><span href="javascript:void(0);" class="commentItem" index=4>差评({{allCommentNum.cha}})</span></li>
            </ul>
        </script>
        <!--商品所有评论-->
        <script type="text/template" id="allCommentsTpl">
            {{if commenList.length>0}} {{each commenList as item index}}
            <div class="commenListItem">
                <div class="userHeader"><img src="{{item.pic}}" alt=""></div>
                <div class="userCommentMsg">
                    <div class="userName">{{item.nickname}} {{if item.score===1}}
                        <span class="goodscore"></span> {{/if}} {{if item.score===0}}
                        <span class="neutralscore"></span> {{/if}} {{if item.score===-1}}
                        <span class="badscore"></span> {{/if}}
                    </div>
                    <div class="commentMsg">{{item.message}}</div>
                    <div class="dateAndProduct">{{item.date}}&nbsp;&nbsp;&nbsp;{{item.sku}}</div>
                </div>
            </div>
            {{/each}}
            <div class="commentsFooter">已到底部</div>
            {{/if}} {{if commenList.length===0}}
            <div class="noComments">暂无评论</div>
            {{/if}}
        </script>
        <!--商品好评-->
        <script type="text/template" id="goodCommentsTpl">
            {{if commenList.length>0}} {{each commenList as item index}}
            <div class="commenListItem">
                <div class="userHeader"><img src="{{item.pic}}" alt=""></div>
                <div class="userCommentMsg">
                    <div class="userName">{{item.nickname}}
                        <span class="goodscore"></span>
                    </div>
                    <div class="commentMsg">{{item.message}}</div>
                    <div class="dateAndProduct">{{item.date}}&nbsp;&nbsp;&nbsp;{{item.sku}}</div>
                </div>
            </div>
            {{/each}}
            <div class="commentsFooter">已到底部</div>
            {{/if}} {{if commenList.length===0}}
            <div class="noComments">暂无评论</div>
            {{/if}}
        </script>
        <!--商品中评-->
        <script type="text/template" id="neutralCommentsTpl">
            {{if commenList.length>0}} {{each commenList as item index}}
            <div class="commenListItem">
                <div class="userHeader"><img src="{{item.pic}}" alt=""></div>
                <div class="userCommentMsg">
                    <div class="userName">{{item.nickname}}
                        <span class="neutralscore"></span>
                    </div>
                    <div class="commentMsg">{{item.message}}</div>
                    <div class="dateAndProduct">{{item.date}}&nbsp;&nbsp;&nbsp;{{item.sku}}</div>
                </div>
            </div>
            {{/each}}
            <div class="commentsFooter">已到底部</div>
            {{/if}} {{if commenList.length===0}}
            <div class="noComments">暂无评论</div>
            {{/if}}
        </script>
        <!--商品差评-->
        <script type="text/template" id="badCommentsTpl">
            {{if commenList.length>0}} {{each commenList as item index}}
            <div class="commenListItem">
                <div class="userHeader"><img src="{{item.pic}}" alt=""></div>
                <div class="userCommentMsg">
                    <div class="userName">{{item.nickname}}
                        <span class="badscore"></span>
                    </div>
                    <div class="commentMsg">{{item.message}}</div>
                    <div class="dateAndProduct">{{item.date}}&nbsp;&nbsp;&nbsp;{{item.sku}}</div>
                </div>
            </div>
            {{/each}}
            <div class="commentsFooter">已到底部</div>
            {{/if}} {{if commenList.length===0}}
            <div class="noComments">暂无评论</div>
            {{/if}}
        </script>
        <script src="../../static/assets/jquery/jquery.min.js"></script>
        <script src="../../static/assets/jquery-lazyload/jquery.lazyload.js"></script>
        <script src="../../static/assets/art-template/template.js"></script>
        <script src="../../static/assets/swiper/swiper-3.4.2.min.js"></script>
        <script src="../../static/assets/clipboard/clipboard.min.js"></script>
        <script src="../../static/js/config/tools.js"></script>
        <script src="../../static/js/config/config.js"></script>
        <script src="../../static/js/classify/product.js"></script>
    </body>

    </html>
</body>

</html>